<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // es5
        // function Parent(name) {
        //     this.name = name
        //     this.color = ["red", "green", "blue"]
        // }
        // // 父类的原型添加方法
        // Parent.prototype.say = function () {
        //     console.log(this.name + "这个人正在说话");
        // }
        // function Child(name, sex) {
        //     // 继承父类的构造函数
        //     Parent.call(this, name);
        //     this.sex = sex
        // }
        // // 子类继承父类的原型
        // Child.prototype = new Parent();
        // // 添加子类的原型的方法
        // Child.prototype.run = function () {
        //     console.log(this.name + "正在跑步");
        // }
        // let p1 = new Child("miku", "女")
        // console.log(p1)

        // es6
        class Parent {
            constructor(name) {
                this.name = name
                this.color = ["red", "green", "blue"]
            }
            say() {
                console.log(this.name, "我是say");
            }
        }
        // 直接继承父类，同时继承方法
        class Child extends Parent {
            constructor(name, sex) {
                super(name);  //超集， 继承父类的构造函数
                this.sex = sex
            }
            run() {
                console.log(this.name, "跑步")
            }
        }
        let p1 = new Child("miku", 18)
        console.log(p1);
    </script>
</body>

</html>